<template>
	
	  <div style="display: flex; justify-content: center; align-items: center; margin: 20rpx;">
	    <view style="display: flex;font-size: 64px; font-weight: bold;">
	      {{ form.id }}
	    </view>
		
	  </div>
	  <div>
		  <view style="display: flex; justify-content: center; align-items: center; margin: 20rpx;">取餐号码</view>
	  </div>
	
	<van-cell-group inset style="margin-top: 20rpx; margin-bottom: 20rpx;">
		<van-cell v-for="item in goods" :key="item.id || item.name" :title="item.name"
			:value="`￥${item.amount}`">
			<template #label>
				数量: {{ item.number }}
			</template>
		</van-cell>
	
	</van-cell-group>
	
	<van-cell-group inset style="margin-top: 20rpx; margin-bottom: 20rpx;">
	  <van-cell title="取餐号" :value="form.id" />
	  <van-cell title="下单时间" :value="form.orderTime" />
	  <van-cell title="订单编号" :value="form.number"  />
	  <van-cell title="备注" :value="form.remark"  />
	  
	</van-cell-group>
</template>

<script setup>
import { ref, reactive, getCurrentInstance, onMounted, watchEffect,toRefs,computed } from 'vue';
import { useRoute } from 'vue-router';
import { getOrders,listDetail} from '@/api/store/list.js';
// 获取当前路由信息
const route = useRoute();

const data = reactive({
  form: {},
  queryParams: {
	id:1,
  },
  params: {
  	orderId:1
  	
  },
  goods: [], // 最终的分组数据
});

const { queryParams, form, goods, params } = toRefs(data);

// 初始化参数

const option = ref({});

function getlist(){
	getOrders(queryParams.value.id).then(response => {
	    form.value = response.data;
	  });
}

function getDetail(){
	listDetail(params.value).then(response => {
	    goods.value=response.rows
		console.log(goods.value)
	  });
}
const props = defineProps({
  id: {
    type: String,
    required: true,
  },
});

// 页面加载时执行
onMounted(() => {
  const query = route.query;
  if (query && query.id) {
    queryParams.value.id = query.id; // 直接赋值
    params.value.orderId = query.id; // 直接赋值
   
  } else {
    console.log('Option is not properly defined.');
  }
   getlist()
  getDetail(); // 调用 getDetail 函数
});
  
</script>

<style>
	
</style>